<template>
  <div class="page">
    <van-nav-bar
      title="个人信息"
      right-text="退出"
      left-arrow
      @click-left="onClickLeft"
      @click-right="onClickRight"
    />
    <p>基础资料</p>
      <ul>
        <li>昵称：{{ nickname }}</li>
        <li>姓名：{{ username }}</li>
        <li>性别：{{ sex }}</li>
        <li>邮箱：{{ email }}</li>
        <li>手机号码：{{ phone }}</li>
        <li>证件号：{{ personid }}</li>
        <li>出生日期：{{ birthday }}</li>
      </ul>
  </div>
</template>

<script lang="ts" setup>
import { ref,watchEffect } from 'vue'
import { getUserInfoList } from '@/api'
import { useRouter } from 'vue-router'


const nickname = ref<string>('')
const username = ref<string>('')
const sex = ref('男')
const email = ref<string>('')
const phone = ref<number>()
const personid = ref<number>()
const birthday = ref<string>()
const router = useRouter()



function onClickLeft() {
  console.log('返回')
  router.replace('/my-order')
}

function onClickRight() {
  console.log('退出')
}


watchEffect(async()=>{
  console.log('watchEffect');
  try{
    const {data} : any=  await getUserInfoList()
    console.log('data',data);
    if(data){
      nickname.value = data[0].params.nickname
      username.value = data[1].params.username
      sex.value = data[0].params.sex
      email.value = data[0].params.email
      phone.value = data[1].params.phone
      personid.value = data[0].params.personid
      birthday.value = data[0].params.birthday
    }


  } catch(error){
    console.error('失败',error);
    
  }
})


</script>
